<!--  -->
<template>
    <van-nav-bar title="商品详情" left-text="返回" left-arrow @click-left="onClickLeft" />
    <div class=''>
        <!-- 优惠券单元格 -->
        <van-coupon-cell  :chosen-coupon="chosenCoupon" @click="showList = true" />
        <!-- 优惠券列表 -->
        <van-popup v-model:show="showList" round position="bottom" style="height: 90%; padding-top: 4px;">
            <van-coupon-list  :chosen-coupon="chosenCoupon" :disabled-coupons="disabledCoupons"
                @change="onChange"/>
        </van-popup>
    </div>
</template>
<script setup lang='ts'>
import { ref } from 'vue';
const onClickLeft = () => history.back();

const coupon = {
    available: 1,
    condition: '无门槛\n最多优惠12元',
    reason: '',
    value: 150,
    name: '优惠券名称',
    startAt: 1489104000,
    endAt: 1514592000,
    valueDesc: '1.5',
    unitDesc: '元',
};

const coupons = ref([coupon]);
const showList = ref(false);
const chosenCoupon = ref(-1);

const onChange = (index) => {
    showList.value = false;
    chosenCoupon.value = index;
};

</script>
<style scoped>

</style>